<script type="text/javascript">
    var FirstLevelColumnList;
    var FirstLevelColumnListLength;


    var getColumnListByPidLength;
    var getColumnListByPid;
    var url = location.href;
    var urls = '';
    var articleLists;
    var pid = serilizeURL(url).pid;  //一级菜单栏id
    var secondMenuId = serilizeURL(url).secondMenuId; //二级菜单栏id

    var cid; //一级菜单栏下默认的第一个二级菜单id

    var typeUrl; //类型，1为文章，2为视频，3为pdf
    var type; //类型，1为文章，2为视频，3为pdf


    var txtName; //二级栏目名称
    var txtFirstName; //一级栏目名称
    function serilizeURL(url) {
        var rs = url.split("?")[1];
        var arr = rs.split("&");
        var json = {};
        for (var i = 0; i < arr.length; i++) {
            if (arr[i].indexOf("=") != -1) {
                json[arr[i].split("=")[0]] = arr[i].split("=")[1];
            }
            else {
                json[arr[i]] = "undefined";
            }
        }
        return json;
    }

    //获取一级菜单页面图片
    function getFirstListImg(pid) {
        $.ajax({
            url: "http://192.168.100.181:8080/api/banner/" + pid + "/head-01/1",
            success: function (data) {
                if (data.data.length > 0) {
                    var list = `<img src=${data.data[0].bannerImg} alt="">`;
                    $(".getFirstImg").append($(list).hide().fadeIn(1000));
                }

            }
        })
    }

    (function getFirstLevelColumnList() {
        localStorage.getItem('getAllColumnList');
        FirstLevelColumnList = JSON.parse(localStorage.getItem('getAllColumnList'));
        FirstLevelColumnListLength = FirstLevelColumnList.length;

        for (var i = 0; i < FirstLevelColumnListLength; i++) {

            var list_active = '<li id=' + FirstLevelColumnList[i].id + '><a href=http://192.168.100.181:8080/huoge-edu/' + FirstLevelColumnList[i].typeUrl + '?pid=' + FirstLevelColumnList[i].id + '&secondMenuId=' + FirstLevelColumnList[i].secondMenuId + '>' + FirstLevelColumnList[i].name + '</li>';
            var mobile_active = `<li data-id=${FirstLevelColumnList[i].id} id=${FirstLevelColumnList[i].id }><a id=mnav${FirstLevelColumnList[i].id} href=http://192.168.100.181:8080/huoge-edu/${FirstLevelColumnList[i].typeUrl}?pid=${FirstLevelColumnList[i].id}&secondMenuId=${FirstLevelColumnList[i].secondMenuId}><span>${FirstLevelColumnList[i].name}</span></li>`;

            $('#j_dy_active').append($(list_active).hide().fadeIn(0));
            $('#mobile-nav').append($(mobile_active).hide().fadeIn(0));

            if (pid && pid === FirstLevelColumnList[i].id) {
                $('#' + FirstLevelColumnList[i].id).addClass('active');
                $('#mnav' + FirstLevelColumnList[i].id).addClass('active');

            } else if (undefined == pid && getColumnListByPid[0].id != undefined) {
                $('#' + FirstLevelColumnList[0].id).addClass('active');
                $('#mnav' + FirstLevelColumnList[0].id).addClass('active');

            }


        }
    })()

    function addActiveTabs(loopPid) {
        if (secondMenuId == undefined && getColumnListByPid[0].id != undefined) {
            secondMenuId = getColumnListByPid[0].id;
            $(' #' + getColumnListByPid[0].id).addClass('active_hover');
            $(' #' + getColumnListByPid[0].id).addClass('active');
            $('#msnav' + getColumnListByPid[0].id).addClass('active');
        }
        if (secondMenuId && secondMenuId === loopPid) {
            $('#' + loopPid).addClass('active_hover');
            $('#' + loopPid).addClass('active');
            $('#msnav' + loopPid).addClass('active');
        }
    }


    function getSecondListByPid(pid) {
        addActiveTabs(secondMenuId);
        $.ajax({
            url: "http://192.168.100.181:8080/api/columnInfo/getColumnListByPid/" + pid,
            success: function (data) {
                getColumnListByPid = data.data;
                getColumnListByPidLength = getColumnListByPid.length;

                for (var i = 0; i < getColumnListByPidLength; i++) {

                    cid = getColumnListByPid[0].id;
                    type = getColumnListByPid[0].type;

                    urls = urls + '<li>' + getColumnListByPid[i].name + '</li>';


                    $('.container .secondMenu-txt').html(getColumnListByPid[i]['columnInfoByParentId'].name);

                    $('.pull-right.hidden-xs .list').append(`<li id=${getColumnListByPid[i].id} data-english="${getColumnListByPid[i].subtitle}" data-type=${getColumnListByPid[i].type} data-typeUrl=${getColumnListByPid[i].typeUrl}><a href="javascript:;">${getColumnListByPid[i].name}</a></li>`);
                    $('.pull-right.mobile-sub-nav.visible-xs .list').append(`<li id=${getColumnListByPid[i].id} data-english="${getColumnListByPid[i].subtitle}"  data-type=${getColumnListByPid[i].type} data-typeUrl=${getColumnListByPid[i].typeUrl}><a href="javascript:;" id=msnav${getColumnListByPid[i].id} >${getColumnListByPid[i].name }</a></li>`);


                    $('.pull-left.hidden-xs .secondMenu-txt').html('<a href="javascript:;">' + getColumnListByPid[i]['columnInfoByParentId'].name + '</a>');
                    $('.dx-abs-nav .dx-txt-nav span').html(getColumnListByPid[i]['columnInfoByParentId'].name);
                    addActiveTabs(getColumnListByPid[i].id);

                }




                if (url.indexOf('secondMenu-index.html') >= 0) {
                    queryArticleByColumnId(secondMenuId);
                }
                $('.pull-right.hidden-xs .list li').on('mouseover', function (event) {
                    $(this).addClass('active_hover');
                })
                $('.pull-right .list li').on('mouseout', function (event) {
                    $('.pull-right.hidden-xs .list li').removeClass('active_hover');
                })

                $('.pull-right .list li').on('click', function (event) {


                    $(event.target).data('typeurl')?typeUrl = $(event.target).data('typeurl'):typeUrl = $(event.target).parent('li').data('typeurl');

                    $('.group-news-lists').empty();
                    $('.mobile-project-list').empty();
                    $('.j_project_slider').empty();
                    $('.text-center .pagination span').empty();

                    $('.pull-right.mobile-sub-nav .list li a').removeClass('active');
                    $('.pull-right.hidden-xs .list li').removeClass('active');


                    $('#' + this.id).addClass('active');
                    $('#msnav' + this.id).addClass('active');

                    location.href = "http://192.168.100.181:8080/huoge-edu/" + typeUrl + "?pid=" + pid + "&secondMenuId=" + this.id;

                })


            }
        })
    }


    function queryArticleByColumnId(id) {
        addActiveTabs(id);


        $.ajax({
            url: "http://192.168.100.181:8080/api/article/queryArticleByColumn?id=" + id,
            success: function (data) {
                $('.group-news-lists .container').empty();
                $('.mobile-project-list').empty();
                $('.j_project_slider').empty();
                articleLists = data.data;
                var articleListsLength = articleLists.length;
                for (var i = 0; i < articleListsLength; i++) {
                    if (articleListsLength > 0) {
                        $('.j_project_slider').append(`
                                            <div class="pic-slider">
                                                <a href="article-details.html?articleId=${articleLists[i].id}&pid=${pid}&secondMenuId=${secondMenuId}" data-articleId=${articleLists[i].id}>
                                                    <img src=${articleLists[i].coverImageUrl} alt="C52A6706.JPG">
                                                    <div class="pic-title">${articleLists[i].title}</div>
                                                </a>
                                             </div>`);

                        $('.mobile-project-list').append(
                            `<div class="text-pic">
                                                <a href="article-details.html?articleId=${articleLists[i].id}&pid=${pid}&secondMenuId=${secondMenuId}" data-articleId=${articleLists[i].id} class="clearfix pb-0 articleLists">
                                                    <div class="col-md-8 col-sm-8 col-xs-8 text">
                                                        <p class="font-14 mb-1">${articleLists[i].title}</p>
                                                        <p class="time font-14">${articleLists[i].createDate}</p>
                                                    </div>
                                                    <div class="pic pull-right">
                                                        <img src=${articleLists[i].coverImageUrl} alt="">
                                                    </div>
                                                </a>
                                            </div>`);


                    }

                }


                if($('.article-title').html($($('.active')[2])[0].innerText)){

                }



                $('.article-title').html($($('.active')[2])[0].innerText);
                $('.english-title').html($($('.active')[2]).data('english'));





                document.title = $($('.active')[2])[0].innerText;


                function pagingContent(ii) {
                    if (articleListsLength > 0) {
                        $('.container.group-news .content .row .project_slider').css("visibility","visible");

                        $('.group-news-lists.container').append(`
                                            <a href="article-details.html?articleId=${articleLists[ii].id}&pid=${pid}&secondMenuId=${secondMenuId}" data-articleId=${articleLists[ii].id} class="list-group clearfix">
                                             <div class="add-img" style="width: 20%;float: left;">
                                                <img src=${articleLists[ii].coverImageUrl} alt="" style="width: 100%">
                                            </div>
                                                <div class="news-content pull-left"  style="width: 80%;float: left;">
                                                    <div class="news-title clearfix">
                                                        <div class="title pull-left">${articleLists[ii].title}</div>
                                                        <div class="time pull-right  hidden-xs"><span>${articleLists[ii].createDate}</span></div>
                                                    </div>
                                                    <div class="news-text mb-1-5">${articleLists[ii].summary}</div>
                                                    <div class="news-link iconfont icon-jiantou pull-right"></div>
                                                </div>
                                            </a>`);
                    } else {
                        $('.container.group-news .content .row .project_slider').css("visibility","hidden");
                        $('.text-center').empty();

                    }
                }


//                function showData(PageCount, PageSize) {
//                    $('.text-center span a').on('click', function (event) {
//                            var selectPage = $(this).attr('selectPage');
//
//                            $('.group-news-lists.container').html('');
//
//                            for (i = (selectPage - 1) * PageSize; i < PageSize * selectPage; i++) {
//                                pagingContent(i);
//                            }
//                            $('#table').append(end);
//                        }
//                    )
//                }
                function bindListener(PageCount, PageSize) {
                    $('.text-center span a').on('click', function (event) {
                        var pageNo = $(this).attr('selectPage');
                        if (pageNo > 3 && pageNo < PageCount - 1) {

//                            $('#table').html('');
//                            $('#table').append(head);
                            for (i = (pageNo - 1) * PageSize; i < PageSize * pageNo; i++) {
                                pagingContent(i);
                            }
//                            $('#table').append(end);

                            $('#page').empty();
                            for (var i = 1; i <= 5; i++) {
                                var pageN = '<a href="#" selectPage="' + parseInt(parseInt(i) + parseInt(pageNo) - parseInt(3)) + '" >第' + parseInt(parseInt(i) + parseInt(pageNo) - parseInt(3)) + '页</a>';
                                $('#page').append(pageN);
                                bindListener(PageCount, PageSize)
                            }
                        }
                        else if (pageNo > 3 && !(pageNo < PageCount - 1)) {
//                            $('#table').html('');
//                            $('#table').append(head);

                            for (i = (pageNo - 1) * PageSize; i < PageSize * pageNo; i++) {
                                pagingContent(selectPage);
                            }
//                            $('#table').append(end);
                        }
                        else if (pageNo <= 3 && pageNo > -1) {
//                            $('#table').html('');
//                            $('#table').append(head);
                            for (i = (pageNo - 1) * PageSize; i < PageSize * pageNo; i++) {
                                pagingContent(selectPage);
                            }
//                            $('#table').append(end);

                            $('#page').empty();
                            for (var i = 1; i <= 5; i++) {
                                var pageN = '<a href="#" selectPage="' + i + '" >第' + i + '页</a>';
                                $('#page').append(pageN);
                                bindListener(PageCount, PageSize)
                            }
                        }
                    })
                }

                //分页
                var Count = data.data.length;//记录条数
                var PageSize = 6;//设置每页示数目
                var PageCount = Math.ceil(Count / PageSize);//计算总页数
                var currentPage = 1;//当前页，默认为1
                var selectPage = '';//当前在哪一页

                //分页按钮
                for (var i = 1; i <= PageCount; i++) {

                    //只显示5个页码，超出隐藏

//                    if(PageCount<6){
//                        var pageN = '<a class="add-a-style hidden-xs" href="javascript:void(0)" selectPage="' + i + '">' + i + '</a>';
//                        $('.text-center .pagination span').append(pageN);
//                    }
//                    else{
//
//                    }

                }
                //显示默认页（第一页）
                for (i = (currentPage - 1) * PageSize; i < PageSize * currentPage; i++) {
                    selectPage = i;
                    pagingContent(selectPage);
                    $('.text-center span a:nth-child(1)').addClass('on');

                }



                if (PageCount < 6) {
                    for (var i = 1; i <= PageCount; i++) {
                        var pageN = '<a class="add-a-style hidden-xs" href="javascript:void(0)" selectPage="' + i + '" >第' + i + '页</a>';
                        $('.text-center .pagination span').append(pageN);
                        showData(PageCount, PageSize)


//                        var pageN = '<a class="add-a-style hidden-xs" href="javascript:void(0)" selectPage="' + i + '">' + i + '</a>';
//                        $('.text-center .pagination span').append(pageN);
                    }
                } else {
                    for (var i = 1; i <= 5; i++) {
                        var pageN = '<a class="add-a-style hidden-xs" href="javascript:void(0)" selectPage="' + i + '" >第' + i + '页</a>';
                        $('.text-center .pagination span').append(pageN);
                        bindListener(PageCount, PageSize)
                    }


//                    //显示选择页的内容
//                    $('.text-center span a').click(function () {
//                        selectPage = $(this).attr('selectPage');
//                        $(this).addClass('on').siblings().removeClass('on');
//                        $('.group-news-lists.container').html('');
//                        for (i = (selectPage - 1) * PageSize; i < PageSize * selectPage; i++) {
//                            pagingContent(i);
//                        }
//                    });
//                    $(".next").click(function () {
//
//                        currentPage= $($('.on')[0]).attr('selectPage');
//                        currentPage=parseInt(currentPage)+1; //当前页数
//                        $('.text-center span a').eq(currentPage-1).addClass('on').siblings().removeClass('on');
//
//                        if (currentPage <= PageCount) {
//                            $('.group-news-lists.container').html('');
//                            for (i = (currentPage - 1) * PageSize; i < PageSize * currentPage; i++) {
//                                pagingContent(i);
//                            }
//                        } else {
//                            return;
//                        }
//                    });
//                    $(".prev").click(function () {
//
//                        currentPage= $($('.on')[0]).attr('selectPage');
//                        currentPage=parseInt(currentPage)-1; //当前页数
//
//                        $('.text-center span a').eq(currentPage - 1).addClass('on').siblings().removeClass('on');
//                        if (currentPage > 0) {
//                            $('.group-news-lists.container').html('');
//                            for (i = (currentPage - 1) * PageSize; i < PageSize * currentPage; i++) {
//                                pagingContent(i);
//                            }
//                        } else {
//                            return;
//                        }
//                    });
                }
            })
    }

    $(document).ready(function () {
        getSecondListByPid(pid);
        getFirstListImg(pid);
        setTimeout(function () {
            var dtSlider = $(".j_project_slider").bxSlider({
                auto: true,
                pager: false,
                pause: 5000,
                onSlideAfter: function () {
                    dtSlider.startAuto();
                }
            });
        },1000)
    });
</script>
<header class="header">
    <div class="dy-header-nav clearfix do-top-bar">
        <div class="dy-logo do-logo hidden-xs">
            <a href="http://192.168.100.181:8080/huoge-edu/index.html">
                <img src="http://192.168.100.181:8080/huoge-edu/src/img/logo.png" alt=""></a>
        </div>
        <div class="dy-nav main-nav-w clearfix hidden-xs">
            <ul class="clearfix main-nav" id="j_dy_active">
            </ul>
        </div>
        <div class="dy-language-chosse do-lang hidden-xs">
            <a href="javascript:;"><i class="iconfont icon-en"></i></a>
            <a class="hidden-xs" href=""><i class="iconfont icon-zhanghu"></i></a>
        </div>

        <!--移动端导航 开始-->
        <div class="visible-xs px-mobile">
            <div class="dy-logo do-logo mobile-logo"><a href="http://192.168.100.181:8080/huoge-edu/index.html"><img
                    src="http://192.168.100.181:8080/huoge-edu/src/img/logo.png" alt=""></a>
            </div>
            <div class="dy-language-chosse do-lang">
                <a href="javascript:;"><i class="iconfont icon-en"></i></a>
            </div>
            <div class="dy-nav main-nav-w clearfix">
                <button class="bread" type="button" id="dropdownMenu2">
                    <i class="icon-bar"></i>
                    <i class="icon-bar"></i>
                    <i class="icon-bar"></i>
                </button>
                <ul class="clearfix main-nav" id="mobile-nav">
                </ul>
            </div>

        </div>
        <!--移动端导航 结束-->

    </div>
</header>
<div class="dx-nav ">
    <p class="getFirstImg">
        <!--<img src="http://192.168.100.29:8080/huoge-edu/src/img/1490926175917351.jpg" alt="dx-banner-03.jpg">-->
    </p>
    <div class="dx-abs-nav">
        <div class="nav" id="j_nav">
            <div class="container clearfix">
                <div class="pull-left hidden-xs">
                    <ol class="breadcrumb">
                        <li><a href="../../index.html">首页</a></li>
                        <li class="secondMenu-txt"></li>
                    </ol>
                </div>
                <div class="pull-right hidden-xs">
                    <div class="mobile-sub-tip"></div>
                    <ul class="list clearfix" style="width: 100%">
                    </ul>
                </div>

                <!--移动二级菜单-->
                <div class="title mobile-title  visible-xs">
                    <div class="container">
                        <p class="secondMenu-txt"></p>
                    </div>
                </div>
                <div class="pull-right mobile-sub-nav visible-xs">
                    <ul class="list clearfix" style="width: 100%">
                    </ul>
                </div>

            </div>

        </div>
        <div class="hidden-xs dx-txt-nav">
            <span></span>
            <p>__</p>
        </div>
    </div>
</div>
